<!DOCTYPE HTML>
<html>

<head>
      <meta charset="utf-8">
      <meta name="viewport" content="maximum-scale=1.0, minimum-scale=1.0, user-scalable=0, initial-scale=1.0, width=device-width" />
      <meta name="format-detection" content="telephone=no, email=no, date=no, address=no">
      <title>Hello APP</title>
      <link rel="stylesheet" type="text/css" href="../css/api.css" />
      <link rel="stylesheet" type="text/css" href="../css/style.css" />
      <script type="text/javascript" src="http://libs.baidu.com/jquery/1.8.0/jquery.min.js" ></script>
      <script type="text/javascript">
       $(document).ready(function() {

              $(".maths").show();
              $(".li").addClass("as");
              // $(".li").css("border-bottom","0.1rem solid #40cccc;").show();
                  $(".li").click(function() {
                      $(".main").hide();
                      $(".maths").show();
                // $(e.target).addClass('active');


                  })



                    $(".lis").click(function() {
                      $(".maths").hide();
                      $(".main").show();
                      $(".li").removeClass("as");

                  })

              })
       // animated
      </script>
    <style>
    body{
        padding-top: 1.5rem;
        width: 100%;
        height: 100%;
    }
    .header{
          width: 93%;
          height: 5.5rem;
          line-height: 2.5rem;
          padding: 0.5rem 0.8rem;
          text-align: center;
          position: fixed;
          top:1.5rem;
          background-color: #fff;
          z-index: 999;
      }
    .header_img{
      width: 6%;
      height: 22%;
      float: left;
      margin-top: 0.5rem;
    }
    .header_img img{
      width: 100%;
      height: 100%;
    }
    .header h3{
      line-height: 3rem;
      height: 3rem;
      width: 90%;
      margin-left: 0.5rem;
      text-align: center;
      font-size: 1.35rem;
    }
    .main{
      width:90%;
      margin: 8rem auto 0rem;
      display: none;
      background: rgb(243,243,243,0.5);
    }
    .main li{
      display: flex;
      background: white;
      background: #fff;
      padding: 0.8rem 0rem 0.5rem 0rem;
      margin-bottom: 0.5rem;
    }
    .main li img{
      width:2.5rem;
      height: 2.5rem;
    }
    .txt{
      width: 100%;
      padding-left: 0.2rem;
    }
    .txt p:nth-child(2){
      font-size: 0.8rem;
      color: #999999;
      padding-bottom: 0.5rem;
    }
    .txt p:nth-child(3){
      font-size: 0.8rem;
      color: #666666;
      padding-bottom: 0.5rem;
    }

    #img{
    display: flex;
    flex-wrap: wrap;
    flex: 1;
    }

    #imgs{
      width: 30%;
      height:7rem;
      margin-right: 0.5rem;
      margin-top: 0.5rem;
    }
    #imgs img{
      width: 100%;
      height: 100%;
    }
    input{
      width:75%;
      margin: 0 auto;
      height: 100%;
      background: rgb(242,242,242);
      padding: 0.8rem;
      border-radius: 1rem;
      outline: none;
    }

    .btn{
          font-size: 1.1rem;
          color:rgb(6,6,6)
    }
    .about{

      z-index: 99999;
      width: 20%;
      height: 2rem;
      color:white;
      line-height: 2rem;
      text-align: center;
      border-radius: 1rem;
      background: #40cccc;
      float: right;
    }
  .fl{
    float: left;
  }
  .fr{
    float: right;
  }
  .bottom{
    margin-top: 3rem;
    width: 100%;
    padding: 0%;
    border: 0.1rem solid #fff;
  }
  .cont_foot{
    width: 100%;
    height: 1.5rem;
    line-height: 1.5rem;
    padding: 0.8rem 0rem 0rem 0rem;
}
.footer_r{
  width:14%;
}
.footer_r p{
  font-size: 0.8rem;
  margin-top: 0.15rem;

}
.footer_img{
    width: 35%;
    height: 15%;
    margin-left: 0.3rem;
      margin-top: 0.3rem;
  }
#image{
  width: 100%;
  height: 100%;
}
.headimg{
  width: 3rem;
  height: 3rem;
  border-radius: 2rem;
}
.ul{
  width: 93%;
  height: 2rem;
  padding: 0.5rem 0.8rem;
}
#a {
    color: #40cccc;
    border-bottom: 0.1rem solid #40cccc;
}
.ul ul{
  width: 50%;
  height: 2rem;
  line-height: 2rem;
  display: flex;
  /*justify-content: space-between;*/
  margin-left: 2rem;
}
.ul ul li{
  width: 26%;
  /*border: 0.1rem solid red;;*/
  height: 2rem;
  float: left;
  margin-right: 2rem;
}
.ul ul li a{
  text-align: center;
  color: black;
  font-size: 1.2rem;
}
.maths{
  width: 92%;
  height: 100%;
  position: fixed;
  background-color: rgb(242, 242, 242, 0.5);
  padding: 0.2rem 1rem;
    overflow: hidden;;
    padding-bottom: 1rem;
    margin-top: 7rem;
    display: none;
}
.maths_one{
  width: 100%;
  height:9rem;
  background-color: #fff;
  margin-top: 0.8rem;
  border-radius: 0.5rem;
}
.ones_img{
  width: 35%;
  height: 8.5rem;

  float: left;
  margin-top: 0.3rem;
  margin-left: 0.2rem;
}
.ones_img img{
  width: 100%;
  height: 100%;
    border-radius: 0.8rem;
}
.ones_text{
  width: 59%;
  padding:0.5rem 0rem 0.5rem 1rem;
  float: left;
}
.tp{
  width: 60%;
  height: 1.5rem;
  border: 1px solid #40cccc;
  color: #40cccc;
  margin-top: 0.3rem;
  line-height: 1.5rem;
  border-radius: 0.5rem;
  text-align: center;
  font-size: 0.9rem;
}
.ttp{
  width: 100%;
  height: 1.5rem;
  margin-top: 0.5rem;
  line-height: 1rem;
  font-size: 0.8rem;
  color: #ccc;
}

.ones_w{
  width:100%;
  height: 1.5rem;
  margin-top:0.5rem;

}
#nav_list{
  background-color: white;
  overflow-x: scroll; /*添加横向滚动条*/
  white-space: nowrap;
  width: 100%;
  height: 1.5rem;
}
ul li:hover{
  border-bottom: 0.1rem solid #40cccc;
}
ul li:visited{
  border-bottom: none;
}
.as{
  border-bottom: 0.1rem solid #40cccc;
}

    </style>


</head>

<body >

  <div class="header">
    <div class="header_img">
      <img src="../image/u18.png" alt="" onclick="closewin()">
    </div>
    <h3>我的收藏</h3>
    <div class="ul">
      <ul>
        <li  class="li a"><a href="#">课程</a></li>
        <li class="lis a"><a href="#">帖子</a></li>
      </ul>
    </div>
  </div>
    <ul class="main" id="postimg">


      <!-- er -->

    </ul>
    <!-- 内容 -->
    <div class="maths" id="cur_list">
      <!-- <div class="maths_one">
        <div class="ones_img">
          <img src="../image/u64.png" alt="">
        </div>
        <div class="ones_text">
          <h4>青少年英语课程</h4>
          <p class="tp">3-6岁幼儿英语</p>
          <p class="ttp">多元教学法趣味学英语，听讲读写能力综合培养</p>
          <div class="ones_w" style="margin-top:1rem;">

            <p style="font-size:0.9rem">15.0km长春·美景天城</p>
          </div>
          <span style="font-size:1.5rem;color:red;float:left;margin-left:70%;margin-top:-0.5rem;">￥78</span>
        </div>
      </div> -->

    </div>

    <script type="text/javascript" src="../script/jquery-1.8.3.js"></script>
    <script type="text/javascript" src="../script/api.js"></script>
    <script type="text/javascript" src="../script/common.js"></script>
</body>
<script>
var page = 1
var pagesize = 10
var ok = true
var userinfo = $api.getStorage('userinfo');
if(userinfo){
  uid=userinfo.id

}else{
  uid = 0
}
apiready = function() {

  api.addEventListener({
      name:'user_login',
      extra:{
          threshold:0
      }
  }, function(ret, err){
          userinfo=$api.getStorage('userinfo');
          uid=userinfo.id
        //	get_user()//获取用户数据
        page=1
        document.getElementById('postimg').innerHTML=''
        get_posting()

  });

  api.addEventListener({
      name:'user_register',
      extra:{
          threshold:0
      }
  }, function(ret, err){
          userinfo=$api.getStorage('userinfo');
          uid=userinfo.id
          //get_user()//获取用户数据
          page=1
          document.getElementById('postimg').innerHTML=''
          get_posting()
  });

  api.addEventListener({
      name:'user_out',
      extra:{
          threshold:0
      }
  }, function(ret, err){
          userinfo=$api.getStorage('userinfo');
          uid=0
        //	get_user()//获取用户数据
        page=1
        document.getElementById('postimg').innerHTML=''
        get_posting()
  });

  get_posting()//获取帖子列表
  get_curlist()//获取课程列表

  api.addEventListener({
      name:'add_posting',
      extra:{
          threshold:0
      }
  }, function(ret, err){
      get_posting()
        //alert( JSON.stringify( ret ) );
  });



}
$(function () {
  $(".now").mousedown(function(event){

  event.stopPropagation();
  });
})
function gzs(self){
alert('阻止成功')

}

function get_curlist(){
  var html =''
  var obj = $api.byId('cur_list');

  api.ajax({
      url: SITE_URL+'cur_api/cur/mycols',
      method: 'post',
      data: {
          values: {
              user_id: uid
          }
      }
  },function(ret, err){
      if (ret) {
        if(ret.error==200){
          if(ret.data.length>0){
            for (var i = 0; i < ret.data.length; i++) {
              var dat = ret.data[i]
              html +='<div class="maths_one" onclick="opense('+dat.cur_id+')">'
              html +='<div class="ones_img">'
              html +='<img src="'+dat.img_url+'" alt="">'
              html +='</div>'
              html +='<div class="ones_text">'
              html +='<h4>'+dat.cur_name+'</h4>'

              html +='<p class="ttp">'+dat.cur_title+'</p>'
              html +='<div class="ones_w" style="margin-top:1rem;">'

              html +='</div>'
              html +='<span style="font-size:1.5rem;color:red;float:right;margin-right:5%;margin-top:-0.2rem;">￥'+dat.price+'</span>'
              html +='</div>'
              html +='</div>'
            }
            $api.html(obj, html);

          }
        }
        //  alert( JSON.stringify( ret ) );
      } else {
        //  alert( JSON.stringify( err ) );
      }
  });

}
function opense(id) {
  api.openWin({
      name: 'curlist',
      url: './curlist.html',
      pageParam: {
                  id: id
              }
  });
}
function get_posting() {
  if(ok==false){
    return false
  }
  var html = ''
  var obj = $api.byId('postimg');

  api.ajax({
      url: SITE_URL+'cur_api/cur/mycol',
      method: 'post',
      data: {
          values: {


              user_id:uid
          }
      }
  },function(ret, err){
      if (ret) {
        if(ret.error==200){

          for (var i = 0; i < ret.data.length; i++) {

            var dat = ret.data[i]
            var time = gettime(dat.add_time);


            html +='<li>'
              html +='<img src="'+dat.head_img+'">'
              html +='<div class="txt">'
              html +='<div class="now">'
                html +='<div class="fl"  onclick="opens('+dat.id+')">'
                  html +='<p>'+dat.nick_name+'</p>'
                  html +='<p>'+time+'</p>'
                html +='</div>'



                // if(dat.gz==1){
                //   html +='<div class="cont_imgs fr user'+dat.user_id+'" title="1" onclick="gz(this,'+dat.user_id+')" style="pointer-events: none;z-index:9999" >'
                //   html +='已关注'
                //   html +='</div>'
                // }else{
                //   html +='<div class="cont_imgs fr user'+dat.user_id+'" title="0" onclick="gz(this,'+dat.user_id+')" style="pointer-events: none;z-index:9999">'
                //   html +='关注'
                //   html +='</div>'
                // }

                if(dat.gz==1){
                  html +='<div class="fr about  user'+dat.user_id+'"  style="background-color:#D1D1D1" title="1" onclick="gz(this,'+dat.user_id+')">已关注</div>'

              }else{
                html +='<div class="fr about  user'+dat.user_id+'"  title="0" onclick="gz(this,'+dat.user_id+')" >关注</div>'
              }

              html +='</div>'
              html +='<div class="bottom"  onclick="opens('+dat.id+')">'
                html +='<p style="margin-left:0rem;width:100%;text-align:left;border:0.1rem solid #fff;padding:0rem;text-indent:0em;">'+dat.content+'</p>'
                html +='<div id="img">'
                if(dat.img_list.length>0&&dat.img_list!=''){
                  for (var is = 0; is < dat.img_list.length; is++) {
                    var img = dat.img_list[is]
                  html +='<div id="imgs"><img src="'+img+'" alt=""></div>'
                  }
                }


                html +='</div>'
              html +='</div>'
              html +='<div class="cont_foot"  onclick="opens('+dat.id+')">'
                html +='<p class="fl">浏览'+dat.browse+'次</p>'
                html +='<div class="footer_r fr">'
                  html +='<p class="fl">'+dat.pl+'</p>'
                  html +='<div class="footer_img fl"><img src="../image/a35.png" alt="" style="margin-top:0.1rem;" id="image"></div>'
                html +='</div>'
                html +='<div class="footer_r fr">'
                  html +='<p class="fl">'+dat.sc+'</p>'
                  html +='<div class="footer_img fl"><img src="../image/aaq.png"  style="margin-bottom:0.3rem" alt="" id="image"></div>'
                html +='</div>'
              html +='</div>'
            html +='</div>'

            html +='</li>'














            // html +='<div class="cont_one" onclick="opens('+dat.id+')" >'
            // html +='<div class="cont_gai">'
            // html +='<div class="cont_top">'
            // html +='<div class="cont_img fl">'
            // html +='<img src="'+dat.head_img+'" alt="" class="headimg">'
            // html +='</div>'
            // html +='<div class="cont_p fl">'
            // html +='<p style="color:red;">'+dat.nick_name+'</p>'
            // html +='<p>'+time+'</p>'
            // html +='</div>'
            // html +='</div>'
            // if(dat.gz==1){
            //   html +='<div class="cont_imgs fr user'+dat.user_id+'" title="1" onclick="gz(this,'+dat.user_id+')" style="pointer-events: none;z-index:9999" >'
            //   html +='已关注'
            //   html +='</div>'
            // }else{
            //   html +='<div class="cont_imgs fr user'+dat.user_id+'" title="0" onclick="gz(this,'+dat.user_id+')" style="pointer-events: none;z-index:9999">'
            //   html +='关注'
            //   html +='</div>'
            // }
            //
            // html+='</div>'
            // html +='<div class="cont_cimgss">'
            // html +='<div class="conts_p">'+dat.content+'</div>'
            // html +='<div class="cont_cimg">'
            // if(dat.img_list){
            //   for (var is = 0; is < dat.img_list.length; is++) {
            //     var img = dat.img_list[is]
            //     html +='<div class="cimg_img">'
            //   html+='<img src="'+img+'" alt="">'
            //     html +='</div>'
            //   }
            // }
            // html+='</div>'
            // html +='</div>'
            // html +='<div class="cont_foot">'
            // html +='<p class="fl">浏览'+dat.browse+'次</p>'
            // html +='<div class="footer_r fr">'
            // html +='<p class="fl">'+dat.pl+'</p>'
            // html +='<div class="footer_img fl">'
            // html +='<img src="../image/a35.png" alt="">'
            // html +='</div>'
            // html +='</div>'
            // html +='<div class="footer_r fr">'
            // html +='<p class="fl">'+dat.sc+'</p>'
            // html +='<div class="footer_img fl">'
            // html +='<img src="../image/a35.png" alt="">'
            // html +='</div>'
            // html +='</div>'
            // html +='</div>'
            // html +='</div>'
          }

          $api.html(obj, html);


        }else{
          ok = false
          msgcode('暂无更新帖子')
        }
        //  alert( JSON.stringify( ret ) );
        api.refreshHeaderLoadDone()
      } else {
        api.refreshHeaderLoadDone()
        msgcode('网络连接失败')
  //        alert( JSON.stringify( err ) );
      }
  });

}

function gz(self,tid) {
  if(!userinfo){
    login_at()
    return false
  }
  if(tid==userinfo.id){
    msgcode('暂不支持关注自己')
    return false
  }

  api.ajax({
      url: SITE_URL+'square_api/collection/gz',
      method: 'post',
      data: {
          values: {
              uid: userinfo.id,
              tid:tid,
              type:self.title
          }
      }
  },function(ret, err){
      if (ret) {
        if(ret.error==200){
          api.sendEvent({
              name: 'gz_user',

          });

          if(self.title==1){//取消管住宿
            msgcode('操作成功')
            $(".user"+tid).html('关注')
            $(".user"+tid).css('background-color','#40cccc')
            $(".user"+tid).attr('title','0')
          }else{//增加关注
            msgcode('操作成功')
            $(".user"+tid).css('background-color','#D1D1D1')
            $(".user"+tid).html('已关注')
            $(".user"+tid).attr('title','1')

          }
        }
        //  alert( JSON.stringify( ret ) );
      } else {
        msgcode('请检查网络连接')
          alert( JSON.stringify( err ) );
      }
  });


}

function opens(id) {
  // alert(id)
    api.openWin({
        name: 'posting',
        url: './posting.html',
        pageParam: {
                    id: id
                }
    });
}


</script>
</html>
